<template name="tie">
	<view class="block">
		<view class="first">
			<view class="biaoti">{{reciveAll.shareName}}</view>
			<image class="collection" src="../static/shoucang-no.png" v-show="showUpImg" @click="changeImg" mode="heightFix"></image>
			<image class="collection" src="../static/shoucang-y.png" v-show="!showUpImg" @click="changeImg" mode="heightFix"></image>
		</view>
		<view class="zhengwen">{{reciveAll.shareContent}}</view>
		<view class="user">
<!-- 			<image class="photo" src="../static/头像.jpg"></image>
			<view class="name">找啊找啊找工作</view> -->
			<view class="date">{{reciveAll.shareTime}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"tie",
		props:["reciveAll"],
		data() {
			return {
				showUpImg:true,
			}
		},
		methods: {
			changeImg:function(){
				this.showUpImg = !this.showUpImg
			}
		}
	}
</script>

<style>
.block{
	position:relative;//定位方式,相对定位
	margin: 5rpx 25rpx 25rpx 25rpx;
	border-radius: 25rpx;
	border: 1px solid #e6e6e6;
	height: 180rpx;
	padding: 20rpx;
	background-color: #FFFFFF;
}
.first{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin:10rpx 10rpx 10rpx 10rpx;//与上面元素距离
}
.biaoti{
	overflow: hidden;
	-webkit-line-clamp: 1;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	max-width: 85%;
}
.date{
	font-size: smaller;	
	margin-left: 30rpx;
}
.zhengwen{
	color: #8a8a8a;
	margin: 15rpx 10rpx 0 10rpx;//与上面元素距离
	font-size: small;
	overflow: hidden;
	-webkit-line-clamp: 2;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}
.user{
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	margin-top: 20rpx;
}
.photo{
	height: 35rpx;
	width: 35rpx;
	border-radius: 50%;
}
.name{
	font-size: smaller;	
}
.collection{
	height: 40rpx;
}
</style>
